iOS App Clipターゲットの追加
このガイドでは、別のファイルを手動で追加する方法について説明します。 Flutter レンダリング iOS App Clip ターゲット 既存の Flutter プロジェクトまたはアプリに追加計画。
動作するサンプルを確認するには、アプリクリップのサンプルGitHub 上で。
ステップ 1 - プロジェクトを開く
iOS Xcode プロジェクトを開きます。ios/Runner.xcworkspace
フル Flutter アプリの場合。
ステップ 2 - App Clip ターゲットを追加する
2.1
プロジェクト ナビゲータでプロジェクトをクリックして表示します プロジェクトの設定。
プレス+ターゲット リストの下部にある をクリックして、新しいターゲットを追加します。

2.2
を選択アプリクリップ新しいターゲットを入力します。

2.3
ダイアログに新しいターゲットの詳細を入力します。
選択する絵コンテインターフェース用。
選択するUIKitアプリデリゲートライフサイクル用。
元のターゲットと同じ言語を選択してください言語。
(つまり、セットアップを簡素化するために、 Swift App Clip ターゲットを作成しないでください Objective-C のメイン ターゲット、またはその逆)。

2.4
次のダイアログでは、 新しいターゲットに対して新しいスキームをアクティブ化します。

ステップ 3 - 不要なファイルを削除する
3.1
プロジェクト ナビゲータで、新しく作成した App Clip グループで、
を除くすべてを削除しますInfo.plist
と<app clip target>.entitlements
。

ファイルをゴミ箱に移動します。
3.2
を使用しない場合は、SceneDelegate.swift
ファイル、
内のそれへの参照を削除します。Info.plist
。
を開きますInfo.plist
ファイルを App Clip グループに追加します。
の辞書エントリ全体を削除します。アプリケーションシーンマニフェスト。

ステップ 4 - ビルド構成を共有する
この手順は、アプリに追加するプロジェクトには必要ありません アプリに追加するプロジェクトにはカスタム ビルドがあるため 構成とバージョン。
4.1
プロジェクト設定に戻り、 ターゲットではなく、今すぐプロジェクト エントリを選択してください。
の中に情報タブの下にある構成展開可能なグループ、展開しますデバッグ、プロフィール、 とリリースエントリ。
それぞれについて、ドロップダウン メニューから同じ値を選択します に対して選択されたエントリとしての App Clip ターゲットの場合 通常のアプリのターゲット。
これにより、App Clip ターゲットが Flutter にアクセスできるようになります。 必要なビルド設定。

4.2
App ClipグループのInfo.plist
ファイル、設定:
-
Build version string (short)
に$(FLUTTER_BUILD_NAME)
-
Bundle version
に$(FLUTTER_BUILD_NUMBER)
ステップ 5 - コードとアセットを共有する
オプション 1 - すべてを共有する
同じ Flutter UI を表示することが目的であると仮定します。 標準アプリではApp Clipと同様に、 同じコードとアセットを共有します。
以下のそれぞれについて:Main.storyboard
、Assets.xcassets
、LaunchScreen.storyboard
、GeneratedPluginRegistrant.m
、 とAppDelegate.swift
(とSupporting Files/main.m
Objective-C を使用している場合)、
ファイルを選択し、インスペクターの最初のタブで、
App Clip ターゲットも含めますTarget Membership
チェックボックスグループ。

オプション 2 - App Clip の Flutter 起動をカスタマイズする
この場合、 にリストされているものをすべて削除しないでくださいステップ3。 代わりに、足場とiOS のアプリ追加 APIFlutter のカスタム起動を実行します。 たとえば、カスタム flutterルート。
ステップ 6 - App Clip に関連付けられたドメインを追加する
これは、App Clip 開発の標準的な手順です。 を参照してください。Appleの公式ドキュメント。
6.1
を開きます<app clip target>.entitlements
ファイル。
を追加Associated Domains
配列型。
次のコマンドを使用して配列に行を追加しますappclips:<your bundle id>
。

6.2
同じ関連ドメイン資格を追加する必要があります メインアプリにも。
をコピーします<app clip target>.entitlements
あなたからのファイル
App Clip グループをメイン アプリ グループに追加し、名前を次のように変更します。
メインターゲットと同じ名前
そのようなRunner.entitlements
。
ファイルを開いて削除しますParent Application Identifiers
メインアプリの資格ファイルのエントリ
(そのエントリは App Clip の権利付与ファイルとして残しておきます)。

6.3
プロジェクト設定に戻り、メインアプリのターゲットを選択します。 を開きますビルド設定タブ。 をセットするコード署名の権利に設定する 2 番目の資格ファイルの相対パス メインアプリ用に作成されました。

ステップ 7 - Flutter を統合する
これらの手順は、アプリに追加する場合には必要ありません。
7.1
App Clipのターゲットのプロジェクト設定で、 を開きますビルド設定タブ。
設定用Framework Search Paths
、2 つのエントリを追加します。
$(inherited)
$(PROJECT_DIR)/Flutter
つまり、メイン アプリ ターゲットのビルド設定と同じです。

7.2
Swift ターゲットの場合、
をセットするObjective-C Bridging Header
ビルド設定をRunner/Runner-Bridging-Header.h
言い換えると、 メインアプリターゲットのビルド設定と同じです。

7.3
今すぐ開きます構築フェーズタブ。を押します。+サイン そして選択します新しいスクリプト実行フェーズ。

新しいフェーズを下にドラッグします。依存関係段階。
新しいフェーズを展開し、次の行をスクリプトのコンテンツに追加します。
/bin/sh "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" build
言い換えると、 メイン アプリ ターゲットのビルド フェーズと同じです。

これにより、Flutter Dart コードが確実にコンパイルされます。 App Clip ターゲットを実行するとき。
7.4
を押します。+署名して選択する新しいスクリプト実行フェーズまた。 それを最後のフェーズとして残します。
今回は、以下を追加します。
/bin/sh "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" embed_and_thin
言い換えると、 メイン アプリ ターゲットのビルド フェーズと同じです。

これにより、Flutter アプリとエンジンが確実に埋め込まれます。 App Clip バンドルに追加します。
ステップ 8 - プラグインを統合する
8.1
を開きますPodfile
Flutter プロジェクト用
またはアプリホストプロジェクトに追加します。
完全な Flutter アプリの場合は、次のセクションを置き換えます。
target 'Runner' do
use_frameworks!
use_modular_headers!
flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
end
と:
use_frameworks!
use_modular_headers!
flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
target 'Runner'
target '<name of your App Clip target>'
ファイルの先頭に、
コメントも解除しますplatform :ios, '11.0'
そして、
2 つのターゲットの iOS のうち最も低いバージョンに変更する
展開ターゲット。
アプリに追加する場合は、次の場所に追加します。
target 'MyApp' do
install_all_flutter_pods(flutter_application_path)
end
と:
target 'MyApp' do
install_all_flutter_pods(flutter_application_path)
end
target '<name of your App Clip target>'
install_all_flutter_pods(flutter_application_path)
end
8.2
コマンドラインから、 Flutter プロジェクト ディレクトリに入る そしてポッドをインストールします。
cd ios
pod install
走る
Xcode から App Clip ターゲットを実行できるようになりました。 スキームのドロップダウンから App Clip ターゲットを選択し、 iOS 14 デバイスを選択して実行を押します。

App Clipを最初から起動してテストするには、 Apple のドキュメントも参照してください。App Clip の起動エクスペリエンスをテストする。
デバッグ、ホットリロード
不幸にもflutter attach
自動検出できません
App Clip 内の Flutter セッションによるもの
ネットワーク許可の制限。
App Clipをデバッグして機能を使用するには ホットリロードと同様に、Observatory URI を探す必要があります。 実行後の Xcode のコンソール出力から。 [保留中: これはまだ本当ですか?]

その後、それをコピーして、flutter attach
接続するコマンドです。
例えば:
flutter attach --debug-uri <copied URI>